import { GetProps, Input } from 'antd'
import { CustomCellEditorProps } from '@ag-grid-community/react'

import styles from './styles.module.less'

type TInputProps = GetProps<typeof Input>

interface IInputCellEditorProps extends CustomCellEditorProps<any, string> {
  inputProps?: Omit<TInputProps, 'size' | 'value' | 'onChange'>
}

export const InputCellEditor = Object.assign(
  ({ api, value, onValueChange, inputProps }: IInputCellEditorProps) => {
    return (
      <Input
        {...inputProps}
        className={styles.InputCellEditor}
        value={value as any}
        onChange={e => onValueChange(e.target.value as any)}
        onBlur={() => api.stopEditing()}
      />
    )
  },
  {
    defineProps: (props: Pick<IInputCellEditorProps, 'inputProps'>): Pick<IInputCellEditorProps, 'inputProps'> => props,
  },
)
